
<!-- 左右两个用float属性,中间用margin进行撑开 -->
<!-- 缺点是1.当宽度小于左右两边宽度之和时,右侧栏会被挤下去 -->
<!-- 2.html结构不正确 -->
<style>
    .left{
        width: 200px;
        height: 300px;
        background: red;
        float: left;
    }
    .right{
        width: 150px;
        height: 300px;
        background: yellow;
        float: right;
    }
    .middle{
        height: 300;
        margin-left: 210px;
        margin-right: 160px;
        background: blue;
    }
</style>
<div class="left">左栏</div>
<div class="right">右栏</div>
<div class="middle">中间栏</div>
